/*------- CSS reset default -----------*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*------- smooth scroll -----*/

html {
    scroll-behavior: smooth;
}

body{
    background-color: #b4d6e4;
}

/*-------- exp-section ---------*/


.exp-section{

}


.exp-head{
    display: flex;
    flex-wrap: wrap;
    margin-left: 45px;
}

.box-name{
    width: 230px;
    padding: 10px;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}


.box-cont{
    width: 78%;
    padding: 10px;
}

/* ------Li style section---------- */
.exp-ul{

font-size: 20px;
background: none;
padding: 0 0 0 48px;
}

.exp-li{
    color: #454545;
    font-size: 20px;
    background: none;
    padding: 9px;
}

/* -----font style section------- */
.title-main{
    font-size: 2rem;
    margin: 3vh;
    color: #b3072c;
    background-color: skyblue;
    padding: 0px 0 0 5%;
}

.exp-head-title{
    
}

.name{
    font-weight: 550;
    color: #ad7610;
   
}

.year{
text-align: center;

}

.exp-head-title{

}

.exp-head-para{
    color: grey;

}

.hr-80{
    margin: 5vh;
    
}

.mg-top{
    margin-top: 12vh;
    margin-bottom: 4vh;
}







/* -------Academic fonts section------ */

.ac-title, .ac-para{
   
    color: #454545;

}


/* --------------skill section------------------ */

.box-skill{
    width: 390px;
    padding: 10px;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    
}

.box-skill-img{
    width: 582px;
    height: 374px;
    padding: 10px;
    margin: auto;
}



.skill-img{
    width: 560px;
    height: 352px;
}


/*-------------- content section -----------*/
@media only screen and (max-width:1110px) {
    .box-cont{
        width: 75%;
    }
}



@media only screen and (max-width:986px) {
    .box-cont{
        width: 71%;
    }

}
   
@media only screen and (max-width:858px) {
    .box-cont{
        width: 96%;
        margin: auto
    }
    .box-name{
        width: 80%;
        margin: auto;
    }

    .box-skill {
        margin: auto;
    }

    .exp-head {
        margin-left: 0px;
    }
    

}
@media only screen and (max-width:550px) {
   
    .box-name{
        width: 60%
     
    }

}


/* -------------skill box section---------------- */

@media only screen and (max-width:972px) {
    .box-skill {
    margin: auto;
    }

}

@media only screen and (max-width:750px) {
    .box-skill {
    margin: auto;
    }




.box-skill-img {
   width: 481px;
    height: 372px;

}


.skill-img{
    width: 460px;
    height: 352px;
}

}


@media only screen and (max-width:530px) {

    .box-skill-img {
        width: 371px;
         height: 372px;
     
     }
     
     
     .skill-img{
         width: 350px;
         height: 352px;
     }

}



@media only screen and (max-width:455px) {
    .work-img{
        height: 248px;
        width: 267px;
       
    }
    .work-img-head {
       
        height: 255px;
        width: 270px;
       
    }
    .work-content {
        padding: 0.8rem;
       width: 100%;
    }

    .work-container {
    margin-top: 23%;
    }
}